<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
  <style type="text/css">
  body {
	background: #E5E5E5 url(images/pageBG.jpg) repeat-x;
	margin: 6px !important;
	margin: 1px;
	}
  </style>
  <?php include ("config.php");
  		//include ("utils.php");
	  	//include(ROOT_DIR_CLASES.'/cCliente.php'); 
  		//include(ROOT_DIR_CLASES.'/log.php');
  		//include(ROOT_DIR_CLASES.'/posiMovil.php');
  		require_once 'JSON.php';
  	if (!isset($_REQUEST['USUARIOID']) || !isset($_REQUEST['CUENTAS']) || !isset($_REQUEST['CUENTASELECTSEGUI']) || !isset($_REQUEST['PUBLICKEY'])) {
  		log::errorJS('Parametros incorrectos...');
  		exit();
  	}	
  	$sessionBykom = BykomCliente::LoginBykom($_REQUEST['USUARIOID'], $_REQUEST['PUBLICKEY']);
  	
  	if ($sessionBykom->cantidad() == 0) {
  		log::errorJS('Sesion expirada...');
  		exit();
  	} else {
  		$hora = strtotime($sessionBykom->campo('HORA', 0));
  		$caduca = strtotime($sessionBykom->campo('CADUCA', 0));
  		if ($hora > $caduca) {
  			log::errorJS('Sesion expirada...');
  			exit();
  		}
  	}	
  	
	
	$ctas = BykomCliente::Cuentas_Movil_User_Bykom($_REQUEST['CUENTAS']);
  	$cuentas =  $_REQUEST['CUENTAS'];
  	$cuentaSelectSegui =  $_REQUEST['CUENTASELECTSEGUI'];
  	$params = "cuentas=" . $cuentas;// . "&cuentaSelectSegui=" . $cuentaSelectSegui;
  	$xCenter = 0;
  	$yCenter = 0;
	
  	$moviles = array();
   	$splitValues = split(",", $cuentas);
	foreach($splitValues as $indice) 
	{
		$posiMovil = new posiMovil();
		$posiMovil->id = $indice;
		
		$datosIdentificacion = BykomCliente::Consulta_Datos_Identificacion_Avl($posiMovil->id);
		$posiMovil->movil = $datosIdentificacion->campo('Movil',0);
   		$posiMovil->descripcion = $datosIdentificacion->campo('Descripcion',0);
   		$posiMovil->identificador =$datosIdentificacion->campo('Identificador',0);
   		$posiMovil->marca = $datosIdentificacion->campo('Marca',0);
   		$posiMovil->modelo = $datosIdentificacion->campo('Modelo',0);
   		$posiMovil->patente = $datosIdentificacion->campo('Patente',0);
   	
   		$datosPosicionamiento = BykomCliente::Consulta_PosicionActual_Avl($posiMovil->id);
   		$posiMovil->tienePosicionActual = $datosPosicionamiento->cantidad();
		if ($posiMovil->tienePosicionActual > 0) {
			$posiMovil->longitud = quitCero($datosPosicionamiento->campo('longitud',0));
			$posiMovil->latitud = quitCero($datosPosicionamiento->campo('latitud',0));
   			$posiMovil->velocidad = $datosPosicionamiento->campo('velocidad',0);
        	$posiMovil->sentido = $datosPosicionamiento->campo('sentido',0);
        	$posiMovil->sentidoPalabra = BykomCliente::Obtener_Palabra_Sentido($posiMovil->sentido);
        	$posiMovil->satelites = $datosPosicionamiento->campo('satelites',0);
        	$posiMovil->direccion = $datosPosicionamiento->campo('direccion',0);
        	$posiMovil->direccionAbrev = BykomCliente::Obtener_Direccion_Abreviada($posiMovil->direccion);
        	$posiMovil->evento = $datosPosicionamiento->campo('evento',0);
        	$posiMovil->validez = BykomCliente::Obtener_Palabra_Validez($datosPosicionamiento->campo('validez',0));
        	$posiMovil->fechaMensaje = $datosPosicionamiento->campo('fechaMensaje',0);
        	$posiMovil->statusZona = $datosPosicionamiento->campo('statusZona',0);
        	$posiMovil->setZonaProhibida($datosPosicionamiento->campo('zonaProhibida',0));
        	$posiMovil->imagenVehiculo = obtener_Imagen_Sentido($datosIdentificacion->campo('TipoAvl',0), $posiMovil->velocidad, $posiMovil->sentido);
			array_push($moviles, $posiMovil);
		}
	}
  	
  ?>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <link href="<?php echo ESTILO?>/bykom.css" rel="stylesheet" type="text/css">
    <script src="js/accordionMenu/SpryAccordion.js" type="text/javascript"></script>
	<link href="js/accordionMenu/SpryAccordion.css" rel="stylesheet" type="text/css" />
    <title>Google Maps</title>
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=<?=GMAP_KEY?>"
            type="text/javascript"></script>
    <script language="javascript" src="js/browserdetect.js"></script>
    <script language="javascript" src="js/json.js"></script>
    <script src="js/mapiconmaker.js" type="text/javascript"></script>
    
    <!-- Calendar Settings -->
	<link href="<?php echo CALENDAR?>/skins/winter/theme.css" rel="stylesheet" type="text/css">
	<script type="text/javascript" src="<?php echo CALENDAR?>/calendar.js"></script>
	<script type="text/javascript" src="<?php echo CALENDAR?>/lang/calendar_es.js"></script>
	<script type="text/javascript" src="<?php echo CALENDAR?>/calendar_setup.js"></script>
	<!-- Color Picker -->
	<script language=JavaScript src="js/picker.js"></script>
    <script type="text/javascript">
    var map;
    var AccordionMenu;
    var READY_STATE_UNINITIALIZED 	= 0;
	var READY_STATE_LOADING 		= 1;
	var READY_STATE_LOADED 			= 2;
	var READY_STATE_INTERACTIVE 	= 3;
	var READY_STATE_COMPLETE 		= 4;
	var NOT_BUSY_IMAGE = "/images/loader_inactive.gif";
	var BUSY_IMAGE = "/images/loader_pulse.gif";
	/*REFRESH*/
	var reqHandler = null;
	var reqParams = <?="'" . $params . "'"?>;
	var results;
	/*HISTORICO*/
	var reqHandlerHistorico = null;
	var resultsHistorico;
	var movil = null;
	var historicoMovil = null;
	var contadorExcesos = 0;
	var contadorEventos = 0;
	
	/*ViewPoint*/
	var reqHandlerViewPoint = null;
	var resultsViewPoint;
	var movilViewPoint = null;
	
	var properties = null;
	var movilSeguimiento = null;
	var movilSelection = null;
	var cuentaSelectSegui = <?="'".$cuentaSelectSegui."'"?>;
	var cuentaSelectSelection = '-1';
	var markers = new Array();
	
	/*FLAGS*/
	var autoRefreshFlag = 0;
	var historicoFlag = 0;
	
	function checkAll()
	{
		var fields = document.getElementsByName('box[]');
		var select = document.getElementById("selectSeguimiento");
		var cuenta = cuentaSelectSegui;
		vaciarSelector(select, fields);
		reqParams = "cuentas=";
		for (i = 0; i < fields.length; i++) {
	    	if (!fields[i].checked) {
				fields[i].checked = true;
	    	}
	    	texto = getTextoFromCheckBox(fields[i]);
			variable = new Option(texto, fields[i].value);
			select.options[select.options.length] = variable;
			if (cuenta == fields[i].value) {
				select.options[i + 1].selected = true;
			}
			reqParams = reqParams + fields[i].value + ",";
		}
		reqParams = reqParams.substring(0,reqParams.length -1);
		RefreshForm();
	}
	
	function seguirSeleccion() {
    	cuentaSelectSegui = cuentaSelectSelection;
    	document.getElementById("selectSeguimiento").value = cuentaSelectSegui;
    	AccordionMenu.openPanelNumber(1);
    	RefreshForm();
    }
    function changeSeguimiento() {
  		cuentaSelectSegui = document.getElementById("selectSeguimiento").value;
  		RefreshForm();
    }
	
	function centrar(latitud, longitud) {
		map.panTo(new GLatLng(latitud, longitud));
	}
    function centrarSeleccion() {
		if (movilSelection == null) return;
		centrar(movilSelection.latitud, movilSelection.longitud);
	}
	
	function quitarSeleccion() {
		movilSelection = null;
		cuentaSelectSelection = '-1';
		RefreshForm();
	}
	
	
	function addParameter(valor) {
		if (reqParams == "cuentas=") {
			 reqParams += valor;
			 return;
		}
		reqParams = reqParams +  "," + valor;
	}
	
	function removeParameter(valor) {
		if (valor == cuentaSelectSegui) {
			cuentaSelectSegui = '-1';
		}
		refreshParameters();
	}
	
	function refreshParameters() {
		fields = document.getElementsByName('box[]');
		nuevoReqParams = "cuentas=";
		for (i = 0; i < fields.length; i++) {
			if (fields[i].checked) { 
				nuevoReqParams += fields[i].value + ",";
			}
		}
		if (nuevoReqParams != "cuentas=") {
			nuevoReqParams = nuevoReqParams.substring(0, nuevoReqParams.length -1);
		}
		reqParams = nuevoReqParams;
		
	}

	function uncheckAll() {
		fields = document.getElementsByName('box[]');
		for (i = 0; i < fields.length; i++) {  
			fields[i].checked = false ;
		}
		select = document.getElementById("selectSeguimiento");
		for (i = 0; i <= fields.length; i++) {
			select.options[1] = null;
		}
		cuentaSelectSegui = '-1';
		cuentaSelectSelection = '-1';
		reqParams = "cuentas=";
		RefreshForm();
	}

	function vaciarSelector(select, fields) {
		for (i = 0; i <= fields.length; i++) {
			select.options[1] = null;
		}
	}

	function verificarChecks()
	{
		fields = document.getElementsByName('box[]');
		for (i = 0; i < fields.length; i++) {
			if (fields[i].checked) return true;
		}
		return false;
	}

	function getTextoFromCheckBox(check) {
		var texto = check.parentNode.parentNode.innerHTML;
		pos = texto.indexOf('texto">');
		if (pos == -1) {
			pos = texto.indexOf('texto>');
		}
		texto = texto.substring(pos + 1);
		texto = texto.substring(texto.indexOf('>') + 1, texto.indexOf('<'));
		return texto;	
	}

	function clickCheckBox(check)
	{
		var cuenta = cuentaSelectSegui;
		var select = document.getElementById("selectSeguimiento");
		var indiceActual = select.selectedIndex; 
		var fields = document.getElementsByName('box[]');
		if (check.checked) // tengo que agregarlo al select
		{
			vaciarSelector(select, fields);
			for (i = 0; i < fields.length; i++) {
				if (fields[i].checked) { 
					texto = getTextoFromCheckBox(fields[i]);
					variable = new Option(texto, fields[i].value);
					select.options[select.options.length] = variable;
				}
			}
			for (i = 1; i < select.options.length; i++) {
				if (select.options[i].value == cuentaSelectSegui) {
					select.options[i].selected = true;
				}
			}
			addParameter(check.value);
		}
		else { // lo tengo que borrar del select
			var indiceSelect = 0;
			for (i = 0; i < select.options.length ; i++) {	
				var selectActual = select.options[i];
				if (check.value == selectActual.value) {
					indiceSelect = i ;
					break;
				}
			}
			select.options[indiceSelect] = null;
			if (indiceActual == indiceSelect) {
				if (select.options.length == 1) { 
					select.options[0].selected = true;
					cuentaSelectSegui = '-1';
				} /*else {
					select.options[1].selected = true;
				}*/
			}
			removeParameter(check.value);
		}
		RefreshForm();
	}

	
	function showDiv(divId) {
  		document.getElementById(divId).style.display = "block";
	}
 
	
	function hideDiv(divId) {
  		document.getElementById(divId).style.display = "none";
	}
	
	function createSimpleMarker(point, icon, message) {
  		var marker = new GMarker(point, {icon: icon, draggable:false});
  		if (message != '') {
  			GEvent.addListener(marker, "click", function() { 
    		marker.openInfoWindowHtml(message);
  			});
  		}
  		return marker;
	}
	function createMarker(point, icon, id) {
  		var marker = new GMarker(point, {icon: icon, draggable:false});
  		GEvent.addListener(marker, "click", function() { 
    		//marker.openInfoWindowHtml(message);
    		cuentaSelectSelection = id;
    		AccordionMenu.openPanelNumber(2);
    		RefreshForm();
  		});
  		return marker;
	}
	
	function obtenerLabelSentido(sentido) {
		if (sentido >= 22 && sentido <= 67)   return "ne";
        if (sentido >= 68 && sentido <= 112)  return "e";
    	if (sentido >= 113 && sentido <= 157) return "se";
    	if (sentido >= 158 && sentido <= 202) return "s";
    	if (sentido >=203  && sentido <= 247) return "so";
    	if (sentido >= 248 && sentido <= 292) return "o";
    	if (sentido >= 293 && sentido <= 337) return "no";
    	if ((sentido >= 338 && sentido <= 360) || ((sentido >= 0 && sentido <= 21)))
    											return "n";
    	return "";										
	}
	
	function obtenerPalabraSentido(sentido) {
    	if (sentido >= 22 && sentido <= 67)     return "NORESTE";
        if (sentido >= 68 && sentido <= 112)  return "ESTE";
    	if (sentido >= 113 && sentido <= 157) return "SURESTE";
    	if (sentido >= 157 && sentido <= 202) return "SUR";
    	if (sentido >=203  && sentido <= 247) return "SUROESTE";
    	if (sentido >= 248 && sentido <= 292) return "OESTE";
    	if (sentido >= 293 && sentido <= 337) return "NOROESTE";
    	if ((sentido >= 338 && sentido <= 360) || ((sentido >= 0 && sentido <= 21)))
												return "NORTE";
		return "";
    }
    
    function replaceAll(strText, strTarget, strSubString) {
		var intIndexOfMatch = strText.indexOf( strTarget );
 		while (intIndexOfMatch != -1){
			strText = strText.replace( strTarget, strSubString )
			intIndexOfMatch = strText.indexOf( strTarget );
		}
		return( strText );
	}
    
    function getMessageMarker(texto, posiMovilReduce) {
    	var message = '';
    	message += '<table bgcolor="#F4F4F4" border="0"><tr><td bgcolor="#F4F4F4"><span class="titulo">' + movil.identificador + '</span></td></tr>';
    	message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Patente: </b><label>' +  movil.patente + '</label></span></td></tr>';
    	message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto">&nbsp;</td></tr>';
    	message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>' + historicoMovil.nombreFiltro + '</b></span></td></tr>';
        message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Velocidad promedio: </b><label>' +  historicoMovil.velocidadPromedio + '</label></span></td></tr>';
        message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Velocidad m&aacutexima: </b><label>' +  historicoMovil.velocidadMaxima + '</label></span></td></tr>';
        message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Distancia recorrida: </b><label>' +  historicoMovil.distanciaRecorrida + '</label></span></td></tr>';
        message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto">&nbsp;</td></tr>';
    	message += '<tr><td align="left" bgcolor="#F4F4F4" aling="center"><span class="texto"><b>' + texto + '</b></span></td></tr>';
		message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Fecha GPS: </b><label>' + posiMovilReduce.fechaMensaje + '</label></span></td></tr>'
	    message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Direcci&oacute;n: </b><label>' + posiMovilReduce.direccionAbrev + '</label></span></td></tr>';
    	message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Latitud: </b><label>' + posiMovilReduce.latitud + '</label></span></td></tr>';
		message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Longitud: </b><label >' + posiMovilReduce.longitud + '</label></span></td></tr>';
		message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Sat&eacute;lites: </b><label>' + posiMovilReduce.satelites + '</label></span></td></tr>';
		message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Sentido: </b><label>' + posiMovilReduce.sentidoPalabra + '</label></span></td></tr>';
		message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Velocidad: </b><label>' + posiMovilReduce.velocidad + '</label></span></td></tr>';
		message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Evento: </b><label>' + posiMovilReduce.evento + '</label></span></td></tr>';
		message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="link">Zona Prohibida: <label>' + posiMovilReduce.zonaProhibida + '</label></span></td></tr>';
		message += '</table>';
    	return message;	
    }
    
    function getMessageMarkerViewPoint(texto, posiMovilReduce) {
    	var message = '';
    	message += '<table bgcolor="#F4F4F4" border="0"><tr><td bgcolor="#F4F4F4"><span class="titulo">' + movilViewPoint.identificador + '</span></td></tr>';
    	message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Patente: </b><label>' +  movilViewPoint.patente + '</label></span></td></tr>';
    	message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto">&nbsp;</td></tr>';
    	message += '<tr><td align="left" bgcolor="#F4F4F4" aling="center"><span class="texto"><b>' + texto + '</b></span></td></tr>';
		message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Fecha GPS: </b><label>' + posiMovilReduce.fechaMensaje + '</label></span></td></tr>'
	    message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Direcci&oacute;n: </b><label>' + posiMovilReduce.direccionAbrev + '</label></span></td></tr>';
    	message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Latitud: </b><label>' + posiMovilReduce.latitud + '</label></span></td></tr>';
		message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Longitud: </b><label >' + posiMovilReduce.longitud + '</label></span></td></tr>';
		message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Sat&eacute;lites: </b><label>' + posiMovilReduce.satelites + '</label></span></td></tr>';
		message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Sentido: </b><label>' + posiMovilReduce.sentidoPalabra + '</label></span></td></tr>';
		message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Velocidad: </b><label>' + posiMovilReduce.velocidad + '</label></span></td></tr>';
		message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Evento: </b><label>' + posiMovilReduce.evento + '</label></span></td></tr>';
		message += '<tr><td align="left" bgcolor="#F4F4F4"><span class="link">Zona Prohibida: <label>' + posiMovilReduce.zonaProhibida + '</label></span></td></tr>';
		message += '</table>';
    	return message;	
    }
    
    function loadInfoHistorico() {
		document.getElementById("historico_movil").innerHTML =  movil.identificador;
		document.getElementById("historico_filtro").innerHTML = historicoMovil.nombreFiltro;
		document.getElementById("historico_velPromedio").innerHTML = historicoMovil.velocidadPromedio + " Km/h";
		document.getElementById("historico_velMaxima").innerHTML = historicoMovil.velocidadMaxima + " Km/h";
		document.getElementById("historico_distanciaRecorrida").innerHTML = historicoMovil.distanciaRecorrida + " Km";
	}
    
    function initExcesos() {
		return '<div><span class="texto"><b>Excesos (' + contadorExcesos + ') : </b></span><br><div  style="OVERFLOW: auto; TOP: 48px; HEIGHT: 100px"><table><tr><td align="center"><span class="texto"><b>Fecha</b></span></td><td align="center"><span class="texto"><b>Velocidad</b></span></td><td align="center">&nbsp;</td></tr>';
	}
	
	function initEventos() {
		return '<div><span class="texto"><b>Eventos (' + contadorEventos + ') : </b></span><br><div style="OVERFLOW: auto; TOP: 48px; HEIGHT: 100px"><table><tr><td align="center"><span class="texto"><b>Fecha</b></span></td><td align="center"><span class="texto"><b>Evento</b></span></td><td align="center">&nbsp;</td></tr>';
	}
	
	function finExcesos() {
		return '</table></div></div>';
	}
	
	function finEventos() {
		return '</table></div></div>';
	}
    
    function procesarExceso(posiMovilReduce) {
		var velocidadIndicada = document.getElementById('excesoVelocidad').value;
		if (velocidadIndicada != '' && eval(velocidadIndicada) <= eval(posiMovilReduce.velocidad)) {
			contadorExcesos++;
			if (eval(posiMovilReduce.edadMensaje) < 255) {
				return "<tr><td align='center'><span class='texto'>" + posiMovilReduce.fechaMensaje + "</span></td><td align='center'><span class='texto'>" + posiMovilReduce.velocidad + "</span></td><td align='center'><a href=javascript:ViewInMapExceso('" + document.getElementById('cuentaSelectHistorico').value +"','" + posiMovilReduce.id + "','historico_avl_" + posiMovilReduce.fechaRecibido.substring(2,4) + posiMovilReduce.fechaRecibido.substring(5,7)  + "'); class='link'> <img alt='ver en mapa' src='<?=IMGS?>/felcha_der.jpg'></a></td></tr>";
			} else {
				return "<tr><td align='center'><span class='texto'>" + posiMovilReduce.fechaMensaje + "</span><img src='imagenes/datoInvalido.gif' title='Posici&oacute;n no v&aacute;lida'></td><td align='center'><span class='texto'>" + posiMovilReduce.velocidad + "</span></td><td align='center'><a href=javascript:ViewInMapExceso('" + document.getElementById('cuentaSelectHistorico').value +"','" + posiMovilReduce.id + "','historico_avl_" + posiMovilReduce.fechaRecibido.substring(2,4) + posiMovilReduce.fechaRecibido.substring(5,7)  + "'); class='link'> <img alt='ver en mapa' src='<?=IMGS?>/felcha_der.jpg'></a></td></tr>";
			}
	   		
		}
		return "";	
	}
	
	function procesarEvento(posiMovilReduce) {
		if (posiMovilReduce.soloLogistica == false) {
			contadorEventos++;
			if (eval(posiMovilReduce.edadMensaje) < 255) {
				return "<tr><td align='left'><span class='texto'>" + posiMovilReduce.fechaMensaje + "</span></td><td align='center'><span class='texto'>" + posiMovilReduce.codigoAlfa + "</span></td><td align='center'><a href=javascript:ViewInMapEvento('" + document.getElementById('cuentaSelectHistorico').value +"','" + posiMovilReduce.id + "','historico_avl_" + posiMovilReduce.fechaRecibido.substring(2,4) + posiMovilReduce.fechaRecibido.substring(5,7)  + "'); class='link'> <img alt='ver en mapa' src='<?=IMGS?>/felcha_der.jpg'></a></td></tr>"
			} else {
				return "<tr><td align='left'><span class='texto'>" + posiMovilReduce.fechaMensaje + "</span><img src='imagenes/datoInvalido.gif' title='Posici&oacute;n no v&aacute;lida'></td><td align='center'><span class='texto'>" + posiMovilReduce.codigoAlfa + "</span></td><td align='center'><a href=javascript:ViewInMapEvento('" + document.getElementById('cuentaSelectHistorico').value +"','" + posiMovilReduce.id + "','historico_avl_" + posiMovilReduce.fechaRecibido.substring(2,4) + posiMovilReduce.fechaRecibido.substring(5,7)  + "'); class='link'> <img alt='ver en mapa' src='<?=IMGS?>/felcha_der.jpg'></a></td></tr>"
			}
		}
		return "";
			
	}
	
	function putIconExceso(posiMovilReduce) {
		var iconOptions = {};
		iconOptions.primaryColor = "#FF00FA";
		iconOptions.strokeColor = "#000000";
		iconOptions.label = "ex";
		iconOptions.labelColor = "#000000";
		var icon = MapIconMaker.createLabeledMarkerIcon(iconOptions);
		var point = new GLatLng(posiMovilReduce.latitud , posiMovilReduce.longitud);
		var message = getMessageMarkerViewPoint("Exceso de velocidad: " + posiMovilReduce.velocidad + " km", posiMovilReduce);
		map.addOverlay(createSimpleMarker(point, icon, message));
	}
	
	function putIconEvento(posiMovilReduce) {
		var iconOptions = {};
		iconOptions.primaryColor = "#ABFAFA";
		iconOptions.strokeColor = "#000000";
		iconOptions.label = "ev";
		iconOptions.labelColor = "#000000";
		var icon = MapIconMaker.createLabeledMarkerIcon(iconOptions);
		var point = new GLatLng(posiMovilReduce.latitud , posiMovilReduce.longitud);
		var message = getMessageMarkerViewPoint("Evento: " + posiMovilReduce.codigoAlfaName, posiMovilReduce);
		map.addOverlay(createSimpleMarker(point, icon, message));
	}

	
	function putIconInicio(posiMovilReduce)
	{
		var iconOptions = {};
		iconOptions.primaryColor = "#<?=COLOR_DEFAULT_RECORRIDO_INI?>";
		iconOptions.strokeColor = "#000000";
		iconOptions.label = "I";
		iconOptions.labelColor = "#000000";
		var icon = MapIconMaker.createLabeledMarkerIcon(iconOptions);
		var point = new GLatLng(posiMovilReduce.latitud , posiMovilReduce.longitud);
		var message = getMessageMarker("Inicio de recorrido", posiMovilReduce);
		map.addOverlay(createSimpleMarker(point, icon, message));
	}
	
	function putIconFin(posiMovilReduce)
	{
		var iconOptions = {};
		iconOptions.primaryColor = "#<?=COLOR_DEFAULT_RECORRIDO_FIN?>";
		iconOptions.strokeColor = "#000000";
		iconOptions.label = "F";
		iconOptions.labelColor = "#000000";
		var icon = MapIconMaker.createLabeledMarkerIcon(iconOptions);
		var point = new GLatLng(posiMovilReduce.latitud , posiMovilReduce.longitud);
		var message = getMessageMarker("Fin de recorrido", posiMovilReduce);
		map.addOverlay(createSimpleMarker(point, icon, message));
	}
	
	function putIconSelection(posiMovilReduce)
	{
		var iconOptions = {};
		iconOptions.primaryColor = "#0000FF";
		iconOptions.strokeColor = "#000000";
		iconOptions.label = "S";
		iconOptions.labelColor = "#000000";
		var icon = MapIconMaker.createLabeledMarkerIcon(iconOptions);
		var point = new GLatLng(posiMovilReduce.latitud , posiMovilReduce.longitud);
		var message = getMessageMarkerViewPoint("Posicion seleccionada", posiMovilReduce);
		map.addOverlay(createSimpleMarker(point, icon, message));
	}
	
	function putIconCar(car)
	{
		var iconOptions = {};
		iconOptions.primaryColor = (eval(car.velocidad) == 0) ? "#FF0000" : "#00FF00";
		iconOptions.strokeColor = "#000000";
		iconOptions.label = obtenerLabelSentido(car.sentido);
		iconOptions.labelColor = "#000000";
		iconOptions.addStar = (car.id == cuentaSelectSegui || car.id == cuentaSelectSelection) ? true : false;
		iconOptions.starPrimaryColor = "#00AAFF";
		if (car.id == cuentaSelectSegui) {
			iconOptions.starPrimaryColor = "#FFFF00";
		}
		iconOptions.starStrokeColor = "#0000FF";
		var icon = MapIconMaker.createLabeledMarkerIcon(iconOptions);
		var point = new GLatLng(car.latitud , car.longitud);
		var message = car.patente + " - " + car.identificador;
		map.addOverlay(createMarker(point, icon, car.id));
	}

	function makeLine(point1, point2, color, ancho) {
		var polyline = new GPolyline([new GLatLng(point1.latitud, point1.longitud), 
									  new GLatLng(point2.latitud, point2.longitud)], 
									  color, ancho);
		map.addOverlay(polyline);
	}
	
	function refreshMovilSeguimiento() {
		var divId = "data_movil";
		if (movilSeguimiento == null || cuentaSelectSegui == '-1') {
			hideDiv(divId);
			return;
		}
		showDiv(divId)
		document.getElementById("movilSeguimientoId").innerHTML = movilSeguimiento.patente + " - " + movilSeguimiento.identificador;
		document.getElementById("movilSeguimientoPatente").innerHTML = movilSeguimiento.patente;
		document.getElementById("movilSeguimientoLatitud").innerHTML = movilSeguimiento.latitud;
		document.getElementById("movilSeguimientoLongitud").innerHTML = movilSeguimiento.longitud;
		document.getElementById("movilSeguimientoVelocidad").innerHTML = movilSeguimiento.velocidad;
		document.getElementById("movilSeguimientoAproximacion").innerHTML = movilSeguimiento.direccionAbrev;
		document.getElementById("movilSeguimientoFechaMensaje").innerHTML = movilSeguimiento.fechaMensaje;
		document.getElementById("movilSeguimientoZonaProhibida").innerHTML = movilSeguimiento.zonaProhibida;	
		document.getElementById("movilSeguimientoSentidoPalabra").innerHTML = obtenerPalabraSentido(movilSeguimiento.sentido);
		document.getElementById("movilSeguimientoSatelites").innerHTML = movilSeguimiento.satelites;
		document.getElementById("movilSeguimientoEvento").innerHTML = movilSeguimiento.evento;
		document.getElementById("movilSeguimientoImg").src = movilSeguimiento.imagenVehiculo; 
		
		map.panTo(new GLatLng(movilSeguimiento.latitud, movilSeguimiento.longitud));
	}
	
	function refreshMovilSelection() {
		var divId = "data_movil_selection";
		if (movilSelection == null || cuentaSelectSelection == '-1') {
			hideDiv(divId);
			return;
		}
		showDiv(divId)
		document.getElementById("movilSelectionId").innerHTML = movilSelection.patente + " - " + movilSelection.identificador;
		document.getElementById("movilSelectionPatente").innerHTML = movilSelection.patente;
		document.getElementById("movilSelectionLatitud").innerHTML = movilSelection.latitud;
		document.getElementById("movilSelectionLongitud").innerHTML = movilSelection.longitud;
		document.getElementById("movilSelectionVelocidad").innerHTML = movilSelection.velocidad;
		document.getElementById("movilSelectionAproximacion").innerHTML = movilSelection.direccionAbrev;
		document.getElementById("movilSelectionFechaMensaje").innerHTML = movilSelection.fechaMensaje;
		document.getElementById("movilSelectionZonaProhibida").innerHTML = movilSelection.zonaProhibida;	
		document.getElementById("movilSelectionSentidoPalabra").innerHTML = obtenerPalabraSentido(movilSelection.sentido);
		document.getElementById("movilSelectionSatelites").innerHTML = movilSelection.satelites;
		document.getElementById("movilSelectionEvento").innerHTML = movilSelection.evento;
		document.getElementById("movilSelectionImg").src = movilSelection.imagenVehiculo; 
		
	}
	
	function mostrarFiltroHistorico() {
		hideDiv('div_resultadoHistorico');
		showDiv('div_filtroHistorico');
	}
	
	function mostrarDataHistorico() {
		loadInfoHistorico();
		
		if (contadorExcesos == 0) {
			hideDiv('div_excesosHistorico');	
		} else {
			showDiv('div_excesosHistorico');
		}
		
		if (contadorEventos == 0) {
			hideDiv('div_eventosHistorico');
		} else {
			showDiv('div_eventosHistorico');
		}
		hideDiv('div_filtroHistorico');
		showDiv('div_resultadoHistorico');
	}
	
	function condicionLinea(primerPunto, segundoPunto) {
		if (eval(segundoPunto.edadMensaje) >= 255) return false;
		if (segundoPunto.codigoAlfa != 'TST') return true;
		var distancia = Math.sqrt(Math.pow(eval(primerPunto.latitud) - eval(segundoPunto.latitud),2) + Math.pow(eval(primerPunto.longitud) - eval(segundoPunto.longitud),2));
		distancia = distancia * 1000;
		if (distancia < 0.5) {
			return false;
		}
		return true;
	}
	
    
    
    function Verificar() {
    	return true;
    }
    
    function SubmitHistoricoReporte() {
    if (Verificar()) 
	{ 
		var str = document.frmHistoricoAvl.colorId.value;
		str = str.substring(1);
		URL = "task_paneReporteGMapBASIC.php?cuentaSelect=" + document.frmHistoricoAvl.cuentaSelect.value 
		    + "&anoi=" + document.frmHistoricoAvl.anoi.value 
		    + "&mesi="  + document.frmHistoricoAvl.mesi.value
		    + "&diai="  + document.frmHistoricoAvl.diai.value
		    + "&horaInicio="  + document.frmHistoricoAvl.horaInicio.value
		    + "&anof=" + document.frmHistoricoAvl.anof.value 
		    + "&mesf="  + document.frmHistoricoAvl.mesf.value
		    + "&diaf="  + document.frmHistoricoAvl.diaf.value
		    + "&horaFin="  + document.frmHistoricoAvl.horaFin.value
		    + "&colorId="  + str
		    + "&thickness="  + document.frmHistoricoAvl.thickness.value
		    + "&excesoVelocidad=" + document.frmHistoricoAvl.excesoVelocidad.value
		    + "&filtrarCeros=" + document.frmHistoricoAvl.filtrarCeros.value
		    + "&pag=1"
		    + "&SESSION=" + '<?=$sessionId?>';//?v="+cuenta+"&codigocuenta="+codigocuenta+"&nom1nom2="+nom1nom2+"&identificadorPatente="+identificadorPatente;
		ancho=780;
  		alto =550;
  		
  		scrollbars = 'no';
  		resize = 'no';	
		day = new Date();
		id = day.getTime();
 		eval("page" + id + " = window.open(URL, '" + id + "', 'width=" + ancho + ",height=" + alto + ",menubar=NO,Status=NO,titlebar=NO,toolbar=NO,top=100,left=200,scrollbars=" + scrollbars + ",resizable=" + resize + "');");
	}
    }
    
    function SubmitHistorico() {
	  dateIni = document.frmHistoricoAvl.mesi.value;
	  dateIni += "/" + document.frmHistoricoAvl.diai.value;
	  dateIni += "/" + document.frmHistoricoAvl.anoi.value;
	  dateIni += " " + document.frmHistoricoAvl.horaInicio.value;
	  dateFin = document.frmHistoricoAvl.mesf.value;
	  dateFin += "/" + document.frmHistoricoAvl.diaf.value;
	  dateFin += "/" + document.frmHistoricoAvl.anof.value;
	  dateFin += " " + document.frmHistoricoAvl.horaFin.value;
	  var DateDde = new Date(dateIni);
	  var DateHta = new Date(dateFin);
	  var time1 = DateDde.getTime();
	  var time2 = DateHta.getTime();	
	  var difHour = (time2 - time1)/Date.HOUR;
      if (difHour < 24){	
    	historicoFlag = 1;
    	var reqParamsHistorico = "COMMAND=HISTORICO";
    	reqParamsHistorico += "&CUENTA=" + document.getElementById('cuentaSelectHistorico').value;
    	reqParamsHistorico += "&diai=" + document.getElementById('diai').value;
    	reqParamsHistorico += "&mesi=" + document.getElementById('mesi').value;
    	reqParamsHistorico += "&anoi=" + document.getElementById('anoi').value;
    	reqParamsHistorico += "&diaf=" + document.getElementById('diaf').value;
    	reqParamsHistorico += "&mesf=" + document.getElementById('mesf').value;
    	reqParamsHistorico += "&anof=" + document.getElementById('anof').value;
    	reqParamsHistorico += "&horaInicio=" + document.getElementById('horaInicio').value;
    	reqParamsHistorico += "&horaFin=" + document.getElementById('horaFin').value;
    	autoRefreshFlag = 1;
    	document.getElementById("busyImg").style.visibility = "visible";
    	if (msie) 
            reqHandlerHistorico = new ActiveXObject("Microsoft.XMLHTTP");
        else
            reqHandlerHistorico = new XMLHttpRequest();

        reqHandlerHistorico.onreadystatechange = OnReadyStateChangeHistorico;    
        reqHandlerHistorico.open("POST", "querycontroller.php", true);
        reqHandlerHistorico.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
		reqHandlerHistorico.send(reqParamsHistorico);
		}
	  else{
	    alert("Este reporte no puede realizarse para un rango de tiempos que superen las 24 horas");
	  }	
    }
    
    function RefreshForm() {
    	if (historicoFlag == 1) return;
    	autoRefreshFlag = 1;
    	document.getElementById("busyImg").style.visibility = "visible";
    	if (msie) 
            reqHandler = new ActiveXObject("Microsoft.XMLHTTP");
        else
            reqHandler = new XMLHttpRequest();

        reqHandler.onreadystatechange = OnReadyStateChange;    
        reqHandler.open("POST", "querycontroller.php", true);
        reqHandler.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        var aux = "COMMAND=REFRESH&" + reqParams;
		reqHandler.send(aux);
		//if (reqHandler.onreadystatechange == null) OnReadyStateChange();
    }
    
    function AutoRefreshForm() {
    	if (autoRefreshFlag == 0) {
    		RefreshForm();
    	}
    }
    
    function refreshFlags(panel) {
    	var indice = panel.getElementsByTagName('INPUT')[0].value;
    	if (indice == '5') return;
    	if (indice == '4') { // HISTORICO
    		mostrarFiltroHistorico();
    		historicoFlag = 1;
    		map.clearOverlays();
    	} else {
    		historicoFlag = 0;
    		RefreshForm();
    	}
    }
    
    function clearHistorico() {
    	map.clearOverlays();
    }
    
    
    /*CallBacks*/
    function OnReadyStateChangeHistorico() {
    	var ready = reqHandlerHistorico.readyState;
		if (ready == READY_STATE_COMPLETE) {
			resultsHistorico = reqHandlerHistorico.responseText.parseJSON();

			if (resultsHistorico.length != 'undefined') {
				movil = resultsHistorico[0];
				historicoMovil = resultsHistorico[1];
				if (resultsHistorico.length > 2) {
					contadorExcesos = 0;
					contadorEventos = 0;
					var htmlEventos = "";
					var htmlExcesos = "";
					var color = document.getElementById('colorId').value;
					var ancho = document.getElementById('thickness').value;
					putIconInicio(resultsHistorico[2]);
					putIconFin(resultsHistorico[resultsHistorico.length - 1]);
					centrar(resultsHistorico[resultsHistorico.length - 1].latitud, resultsHistorico[resultsHistorico.length - 1].longitud);
					primerPunto = resultsHistorico[2];
					for (var i = 2; i < resultsHistorico.length - 1; i++) {
						
						htmlExcesos += procesarExceso(resultsHistorico[i]);
						htmlEventos += procesarEvento(resultsHistorico[i]);
						segundoPunto = resultsHistorico[i+1];
						if (condicionLinea(primerPunto, segundoPunto) || segundoPunto == resultsHistorico[resultsHistorico.length - 1]) {
							makeLine(primerPunto, segundoPunto, color, ancho);
							primerPunto = segundoPunto;
						}
					}

					htmlExcesos = initExcesos() + htmlExcesos + finExcesos();
					htmlEventos = initEventos() + htmlEventos + finEventos();
					document.getElementById('div_excesosHistorico').innerHTML = htmlExcesos;
					document.getElementById('div_eventosHistorico').innerHTML = htmlEventos;
					mostrarDataHistorico();
					
				} else {
					alert('No hubo resultados para la busqueda realizada.');
				}
			} else {
				alert('Ocurrio un problema al realizar la busqueda.');
			}
			document.getElementById("busyImg").style.visibility = "hidden";
			autoRefreshFlag = 0;
			reqHandlerHistorico = null;
		}
    }
    
	function OnReadyStateChange() {
    	var ready = reqHandler.readyState;
		if (ready == READY_STATE_COMPLETE) {
			movilSelection = null;
			movilSeguimiento = null;
			map.clearOverlays();
			results = reqHandler.responseText.parseJSON();
			if (results.length != 'undefined') {
				for (var i = 0; i < results.length; i++) {
					putIconCar(results[i]);
        			if (cuentaSelectSegui == results[i].id) {
        				movilSeguimiento = results[i];
        			}
        			if (cuentaSelectSelection == results[i].id) {
        				movilSelection = results[i];
        			}
				}	
			}
			refreshMovilSeguimiento();
			refreshMovilSelection();
			document.getElementById("busyImg").style.visibility = "hidden";
			autoRefreshFlag = 0;
			reqHandler = null;
		}
    }
    
    function OnReadyStateChangeViewInMap() {
    	var ready = reqHandlerViewPoint.readyState;
		if (ready == READY_STATE_COMPLETE) {
			resultsViewPoint = reqHandlerViewPoint.responseText.parseJSON();
			if (resultsViewPoint.length != 'undefined') {
				movilViewPoint = resultsViewPoint[0];
				if (resultsViewPoint.length > 1) {
					putIconSelection(resultsViewPoint[1]);
					centrar(resultsViewPoint[1].latitud, resultsViewPoint[1].longitud);
				} else {
					alert('No se encontro el punto seleccionado.');
				}
			} else {
				alert('Ocurrio un problema al realizar la busqueda.');
			}
			document.getElementById("busyImg").style.visibility = "hidden";
			autoRefreshFlag = 0;
			reqHandlerViewPoint = null;
		}
    }
    
    function OnReadyStateChangeViewInMapEvento() {
		var ready = reqHandlerViewPoint.readyState;
		if (ready == READY_STATE_COMPLETE) {
			resultsViewPoint = reqHandlerViewPoint.responseText.parseJSON();
			if (resultsViewPoint.length != 'undefined') {
				movilViewPoint = resultsViewPoint[0];
				if (resultsViewPoint.length > 1) {
					putIconEvento(resultsViewPoint[1]);
					centrar(resultsViewPoint[1].latitud, resultsViewPoint[1].longitud);
				} else {
					alert('No se encontro el punto seleccionado.');
				}
			} else {
				alert('Ocurrio un problema al realizar la busqueda.');
			}
			document.getElementById("busyImg").style.visibility = "hidden";
			autoRefreshFlag = 0;
			reqHandlerViewPoint = null;
		}
	}
	
	function OnReadyStateChangeViewInMapExceso() {
		var ready = reqHandlerViewPoint.readyState;
		if (ready == READY_STATE_COMPLETE) {
			resultsViewPoint = reqHandlerViewPoint.responseText.parseJSON();
			if (resultsViewPoint.length != 'undefined') {
				movilViewPoint = resultsViewPoint[0];
				if (resultsViewPoint.length > 1) {
					putIconExceso(resultsViewPoint[1]);
					centrar(resultsViewPoint[1].latitud, resultsViewPoint[1].longitud);
				} else {
					alert('No se encontro el punto seleccionado.');
				}
			} else {
				alert('Ocurrio un problema al realizar la busqueda.');
			}
			document.getElementById("busyImg").style.visibility = "hidden";
			autoRefreshFlag = 0;
			reqHandlerViewPoint = null;
		}
	}
	
	/******************************************/
    
    function ViewInMap(cuenta, historicoId, tabla) {
       	historicoFlag = 1;
    	var reqParamsViewPoint = "COMMAND=VIEWPOINT";
    	reqParamsViewPoint += "&CUENTA=" + cuenta;
    	reqParamsViewPoint += "&HISTORICOID=" + historicoId;
    	reqParamsViewPoint += "&SEARCHALFA=0";
    	reqParamsViewPoint += "&TABLA=" + tabla;
    	autoRefreshFlag = 1;
    	document.getElementById("busyImg").style.visibility = "visible";
    	if (msie) 
            reqHandlerViewPoint = new ActiveXObject("Microsoft.XMLHTTP");
        else
            reqHandlerViewPoint = new XMLHttpRequest();

        reqHandlerViewPoint.onreadystatechange = OnReadyStateChangeViewInMap;    
        reqHandlerViewPoint.open("POST", "querycontroller.php", true);
        reqHandlerViewPoint.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
		reqHandlerViewPoint.send(reqParamsViewPoint);
    }
    
    function ViewInMapEvento(cuenta, historicoId, tabla) {
       	historicoFlag = 1;
    	var reqParamsViewPoint = "COMMAND=VIEWPOINT";
    	reqParamsViewPoint += "&CUENTA=" + cuenta;
    	reqParamsViewPoint += "&HISTORICOID=" + historicoId;
    	reqParamsViewPoint += "&SEARCHALFA=1";
    	reqParamsViewPoint += "&TABLA=" + tabla;
    	autoRefreshFlag = 1;
    	document.getElementById("busyImg").style.visibility = "visible";
    	if (msie) 
            reqHandlerViewPoint = new ActiveXObject("Microsoft.XMLHTTP");
        else
            reqHandlerViewPoint = new XMLHttpRequest();

        reqHandlerViewPoint.onreadystatechange = OnReadyStateChangeViewInMapEvento;    
        reqHandlerViewPoint.open("POST", "querycontroller.php", true);
        reqHandlerViewPoint.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
		reqHandlerViewPoint.send(reqParamsViewPoint);
    }
    
    function ViewInMapExceso(cuenta, historicoId, tabla) {
       	historicoFlag = 1;
    	var reqParamsViewPoint = "COMMAND=VIEWPOINT";
    	reqParamsViewPoint += "&CUENTA=" + cuenta;
    	reqParamsViewPoint += "&HISTORICOID=" + historicoId;
    	reqParamsViewPoint += "&SEARCHALFA=0";
    	reqParamsViewPoint += "&TABLA=" + tabla;
    	autoRefreshFlag = 1;
    	document.getElementById("busyImg").style.visibility = "visible";
    	if (msie) 
            reqHandlerViewPoint = new ActiveXObject("Microsoft.XMLHTTP");
        else
            reqHandlerViewPoint = new XMLHttpRequest();

        reqHandlerViewPoint.onreadystatechange = OnReadyStateChangeViewInMapExceso;    
        reqHandlerViewPoint.open("POST", "querycontroller.php", true);
        reqHandlerViewPoint.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
		reqHandlerViewPoint.send(reqParamsViewPoint);
    }
    
   

    </script>
     
  </head>
  <body onload="initialize()" onunload="GUnload()">
  <form name="frmHistoricoAvl">
  
  <table bgcolor="#F4F4F4" cellspacing="0" style="border:1px solid #999999;">
  <tr>
  	<td height="60" bgcolor="#FFFFFF" border="0" align="center" valign="bottom">
       <img width="700" height="60" src="imagenes/topmaps.jpg">  	  
  	</td>
   	<td height="60" bgcolor="#FFFFFF" border="0" align="right" valign="bottom">
       <img id="busyImg" src="imagenes/loader_pulse.gif" style="vertical-align:bottom">
       <img width="200" height="60" src="imagenes/logomaps.jpg">  	  
  	</td> 	
  </tr>
  <tr>
  
  	<td valign="top">
    	<div id="map_canvas" style="width: 750px; height: 500px"></div>
  	</td>
  
  <td bgcolor="#F4F4F4" border="0" valign="top">
  <table width="300px" border="0" cellspacing="0" cellpadding="0">
  <tr>
  <td>
  <div id="AccordionMenu" class="Accordion" tabindex="0">
      <div class="AccordionPanel">
        <div class="AccordionPanelTab"><span class="texto"><b>Veh&iacute;culos</b></span></div>
        
        <div class="AccordionPanelContent">
        	<input type="hidden" id="titulo" value="1" name="titulo"/>
        	<table border='0' cellspacing='0' style='border-collapse: collapse' width='100%' >
					<tr>
						<td colspan="2">
						   <input type="button" onclick="checkAll()" value="Todos">
						   <input type="button" onclick="uncheckAll()" value="Ninguno">
						</td>
					</tr>
					<tr>
						<td colspan="2">&nbsp;
					</td>
					</tr>
			</table>
					
			<div style="OVERFLOW: auto; WIDTH: 250px; TOP: 48px; HEIGHT: 200px">
				<table>
					<?php
                		   	for($i=0;$i<$ctas->cantidad();$i++) {
                                $checked = "";
                                $pos = strpos($params, $ctas->campo('ORDER_ID', $i));
								if ($pos !== false || $ctas->campo('ORDER_ID', $i) == $cuentaSelectSegui) {
									$checked = "checked";
								}
								echo "<tr>
                                   <td>
                                      <input type=checkbox name=box[] class='formchico' value='".$ctas->campo('ORDER_ID',$i)."'".$checked." onClick='clickCheckBox(this);'></td>
                                   </td>
                                   <td>
                                   <span class='texto'>".
                                      $ctas->campo('patente',$i)." - ".$ctas->campo('identificador',$i)."
                                   </span>
                                   </td>
                                   </tr>";   
                                   
                	}?>
            	</table>
            </div>
        </div>
	  </div>	
      <div class="AccordionPanel">
        <div class="AccordionPanelTab"><span class="texto"><b> Seguimiento </b></span></div>
        
        <div class="AccordionPanelContent">
        <br>
        	<input type="hidden" id="titulo" value="2" name="titulo"/>
        	<div id="divSeguimiento" style="width: 300px">
			<table bgcolor="#F4F4F4" border="0" style="width: 250px">
  			<tr>
  				<td>
  					<span class="texto"> M&oacute;vil: </span>
  				</td>
  				
  				<td>
  					<select name='selectSeguimiento' id="selectSeguimiento" class='formchico' onchange="changeSeguimiento();">
          			<option value="-1">Ninguno</option>;
                	       <?php
                		   	foreach($moviles as $posiMovilActual)
							{
							 	$selected = "";
								if ($posiMovilActual->id == $cuentaSelectSegui) $selected = "selected";
								echo "<option value='".$posiMovilActual->id."' ".$selected.">".
                                      	$posiMovilActual->patente . " - " . $posiMovilActual->identificador . "
                                   	  </option>";
                			}?>
      				</select>
     			</td>
     		</tr>
  			</table>
  			</div>
  		
          <div id="data_movil" style="width: 300px">
    		<table bgcolor="#F4F4F4" border="0" >
    		<tr><td>&nbsp;</td></tr>
    		<tr>
       			<td bgcolor="#F4F4F4"><span class="titulo2">Seguimiento de m&oacute;vil:</span></td>
       			<td bgcolor="#F4F4F4"><img id="movilSeguimientoImg" style="vertical-align:bottom"></td>
    		</tr>
    		<tr>
    			<td bgcolor="#F4F4F4"><span class="titulo" id="movilSeguimientoId"></span></td>
    		</tr>
    		<tr>
    			<td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Patente: </b><label id="movilSeguimientoPatente"></label></span></td>
    		</tr>	
			<tr>
    			<td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Fecha GPS: </b><label id="movilSeguimientoFechaMensaje"></label></span></td>
    		</tr>
    		<tr>
    			<td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Direcci&oacute;n: </b><label id="movilSeguimientoAproximacion"></label></span></td>
    		</tr>
    		<tr>
				<td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Latitud: </b><label id="movilSeguimientoLatitud"></label></span></td>
    		</tr>
			<tr>
    			<td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Longitud: </b><label id="movilSeguimientoLongitud"></label></span></td>
			</tr>
			<tr>
    			<td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Sat&eacute;lites: </b><label id="movilSeguimientoSatelites"></label></span></td>
			</tr>
			<tr>
    			<td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Sentido: </b><label id="movilSeguimientoSentidoPalabra"></label></span></td>
			</tr>
			<tr>
    			<td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Velocidad: </b><label id="movilSeguimientoVelocidad"></label></span></td>
			</tr>
			<tr>
    			<td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Evento: </b><label id="movilSeguimientoEvento"></label></span></td>
			</tr>
			<tr>
    			<td align="left" bgcolor="#F4F4F4"><span class="link">Zona Prohibida: <label id="movilSeguimientoZonaProhibida"></label></span></td>
			</tr>
			</table>  
  		  </div>
        </div>
      </div>
      <div class="AccordionPanel">
        <div class="AccordionPanelTab" id="panelSelection"><span class="texto"><b>Selecci&oacute;n actual</b></span></div>
        <div class="AccordionPanelContent">
        <div id="data_movil_selection" style="width: 300px">
        	<input type="hidden" id="titulo" value="3" name="titulo"/>
    		<table bgcolor="#F4F4F4" border="0" >
    		<tr>
       			<td bgcolor="#F4F4F4"><span class="titulo2">Selecci&oacute;n actual:</span></td>
       			<td bgcolor="#F4F4F4"><img id="movilSelectionImg" style="vertical-align:bottom"></td>
    		</tr>
    		<tr>
    			<td bgcolor="#F4F4F4"><span class="titulo" id="movilSelectionId"></span></td>
    		</tr>
    		<tr>
    			<td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Patente: </b><label id="movilSelectionPatente"></label></span></td>
    		</tr>	
			<tr>
    			<td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Fecha GPS: </b><label id="movilSelectionFechaMensaje"></label></span></td>
    		</tr>
    		<tr>
    			<td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Direcci&oacute;n: </b><label id="movilSelectionAproximacion"></label></span></td>
    		</tr>
    		<tr>
				<td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Latitud: </b><label id="movilSelectionLatitud"></label></span></td>
    		</tr>
			<tr>
    			<td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Longitud: </b><label id="movilSelectionLongitud"></label></span></td>
			</tr>
			<tr>
    			<td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Sat&eacute;lites: </b><label id="movilSelectionSatelites"></label></span></td>
			</tr>
			<tr>
    			<td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Sentido: </b><label id="movilSelectionSentidoPalabra"></label></span></td>
			</tr>
			<tr>
    			<td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Velocidad: </b><label id="movilSelectionVelocidad"></label></span></td>
			</tr>
			<tr>
    			<td align="left" bgcolor="#F4F4F4"><span class="texto"><b>Evento: </b><label id="movilSelectionEvento"></label></span></td>
			</tr>
			<tr>
    			<td align="left" bgcolor="#F4F4F4"><span class="link">Zona Prohibida: <label id="movilSelectionZonaProhibida"></label></span></td>
			</tr>
			<tr>
				<td>&nbsp;</td>
				<td>&nbsp;</td>
			</tr>
			<tr>
				<td align="center" colspan="2">
					<input type="button" onclick="centrarSeleccion()" value="Centrar">	
					<input type="button" onclick="seguirSeleccion()" value="Seguir">
					<input type="button" onclick="quitarSeleccion()" value="Quitar">
				</td>
				
			</table>  
  		  </div>
        </div>
      </div>
      <div class="AccordionPanel">
        <div class="AccordionPanelTab"><span class="texto"><b> Historico </b></span></div>
        <div class="AccordionPanelContent">
        	<input type="hidden" id="titulo" value="4" name="titulo"/>
            <div id="div_resultadoHistorico" style="width: 300px">
            <table>
            	<tr>
            		<td align="left" bgcolor="#F4F4F4"><span class="texto">
            			<b><label id="historico_movil"></label></b></span>
            		</td>
            		<td align="right">
            			<input type="button" onclick="mostrarFiltroHistorico();" value="volver"/>
            		</td>
            		<td><input type="button" onclick="clearHistorico();" value="Limpiar" align="center" size="20"></td>
            	</tr>
            		
            	<tr><td align="left" bgcolor="#F4F4F4" colspan="2"><span class="link"><b><label id="historico_filtro"></label></b></span></td></tr>
            	<tr><td align="left" bgcolor="#F4F4F4" colspan="2"><span class="texto"><b>Velocidad promedio: </b><label id="historico_velPromedio"></label></span></td></tr>
            	<tr><td align="left" bgcolor="#F4F4F4" colspan="2"><span class="texto"><b>Velocidad m&aacute;xima: </b><label id="historico_velMaxima"></label></span></td></tr>
            	<tr><td align="left" bgcolor="#F4F4F4" colspan="2"><span class="texto"><b>Distancia recorrida: </b><label id="historico_distanciaRecorrida"></label></span></td></tr>
            </table>
            <div id="div_eventosHistorico" style="width: 280px"></div>
            <div id="div_excesosHistorico" style="width: 280px"></div>
            </div>
        	
            <div id="div_filtroHistorico" style="width: 300px">
        	
    		<table>
				   <tr>
				        <td colspan="2"><span class="operation">Recorrido</span></td>
				   </tr>
				   
				   <tr>
				        <td colspan="2">
				            Mapeo y reporte hist&oacute;rico de recorrido del veh&iacute;culo seleccionado seg&uacute;n rango de fechas.
				        </td>
				   </tr>
				   
				   <tr>
				   		<td width="48" align="left" valign="middle" class="texto">M&oacute;vil:</td>
				   		<td height="25" align="left" valign="middle" >
                        <input type="hidden" name="pag" value="1"/> 
				   		<select name='cuentaSelect' class='formchico' id="cuentaSelectHistorico">
                		   <?php
                		   	for($i=0;$i<$ctas->cantidad();$i++)
							{
								$selected = "";
								if ($ctas->campo('ORDER_ID',$i) == $cuentaSelectSegui) {
									$selected = "selected";
								}
                                echo "<option value='".$ctas->campo('ORDER_ID',$i)."' ".$selected.">".
                                      	$ctas->campo('patente',$i)." - ".$ctas->campo('identificador',$i);"
                                   	  </option>";   	  
                			}?>
                      	    </select>
                      	</td>
                   </tr>         
				   <tr>      
                      <td width="48" align="left" valign="middle" class="texto">Desde:</td>
                      <td height="25" align="left" valign="middle" > 
                   			<input type="hidden" name="diai" id="diai">  
                            <input type="hidden" name="mesi" id="mesi">
                            <input type="hidden" name="anoi" id="anoi">
                            <input type="hidden" name="horaInicio" id="horaInicio">  	
                           	<input type="text" name="fechaInicio" id="fechaInicio" class="formchico" size="20" maxlength="20" disabled="disabled" value="">
                     
               		   <img src="<?php echo CALENDAR?>/img/calendar.gif" name="fechaInicioBtn" id="fechaInicioBtn" style="cursor: pointer;" title="Seleccionar fecha y hora desde..." onmouseover="this.style.background='#DFB308';" onmouseout="this.style.background='';" />
                     </td>
                    </tr>
          
                    <tr>
                      <td width="48" align="left" valign="middle" class="texto">Hasta:</td>
                      <td height="25"align="left" valign="middle"> 
                   			<input type="hidden" name="diaf" id="diaf">  
                            <input type="hidden" name="mesf" id="mesf">
                            <input type="hidden" name="anof" id="anof">
                            <input type="hidden" name="horaFin" id="horaFin">  	
                           	<input type="text" name="fechaFin" id="fechaFin" class="formchico" size="20" maxlength="20" disabled="disabled" value="">
                     
               		   <img src="<?php echo CALENDAR?>/img/calendar.gif" name="fechaFinBtn" id="fechaFinBtn" style="cursor: pointer;" title="Seleccionar fecha y hora desde..." onmouseover="this.style.background='#DFB308';" onmouseout="this.style.background='';" />
                     </td>
                    </tr>
				</table>
				<hr>
				<table>
				<tr>
						<td class="texto" width="40">Color:</td>
						<td bgcolor="#ffffff" valign="top">
							<!-- Add input box to the form -->
							<input type="hidden" name="colorId" id="colorId" value="<?=COLOR_DEFAULT_RECORRIDO_GMAP?>">
							<input type="Text" name="colorText" id="colorText" size="4" class="formchico">
							<a href="javascript:TCP.popup(document.forms['frmHistoricoAvl'].elements['colorId'],document.forms['frmHistoricoAvl'].elements['colorText'])">
							   <img width="15" height="13" border="0" alt="Click aqui para seleccionar color de recorrido" src="taskPanels/img/sel.gif">
							</a>
						</td>
				        <td class="texto">&nbsp;</td>
				        <td class="texto">&nbsp;</td>
						<td class="texto">Ancho:</td>
						<td bgcolor="#ffffff" valign="top">
						<select name="thickness" id="thickness" class="formchico">	
						   <option value="2">Fino</option>
						   <option value="4">Medio</option>
						   <option value="6">Grueso</option>
						</select>   
						</td>
				</tr>
				</table>
				<hr>
				<table>
				<tr>
				   <td class="texto">Exceso de velocidad (Km):</td>
				   <td><input type="Text" name="excesoVelocidad" id="excesoVelocidad" size="4" class="formchico"></td>
				</tr>
				</table>
				<table>
				<tr>
				   <td class="texto">Filtrar vel. igual a 0:</td>
				   <td>
				   		<select name="filtrarCeros" id="filtrarCeros" class="formchico">	
							<option value="false">NO</option>   
				   			<option value="true">SI</option>
						</select>   
				   </td>
				</tr>
				</table>
				<hr>
				<table width="100%">
				<tr>
					<td>&nbsp;</td>	
					<td>&nbsp;</td>
					<td>&nbsp;</td>
					<td>&nbsp;</td>
					<td>&nbsp;</td>
					<td><input type="button" onclick="SubmitHistorico();" value="Mapeo" align="center" size="20"></td>
					<td><input type="button" onclick="SubmitHistoricoReporte();" value="Hist&oacute;rico" align="center" size="20"></td>
					<td><input type="button" onclick="clearHistorico();" value="Limpiar" align="center" size="20"></td>
				</tr>
			</table>	
    		</div>
        </div>
      </div>
      <div class="AccordionPanel">
        <div class="AccordionPanelTab"><span class="texto"><b> Referencias </b></span></div>
        <div class="AccordionPanelContent">
        	<div id="div_references" style="width: 300px; OVERFLOW: auto;">
        	<input type="hidden" id="titulo" value="5" name="titulo"/>
    		<table bgcolor="#F4F4F4" border="0" >
    		<tr>
       			<td bgcolor="#F4F4F4"><img src="imagenes/ref/movilMov.gif" style="vertical-align:bottom"></td>
       			<td bgcolor="#F4F4F4"><span class="texto">M&oacute;vil en movimiento</span></td>
    		</tr>
    		<tr>
       			<td bgcolor="#F4F4F4"><img src="imagenes/ref/movilStop.gif" style="vertical-align:bottom"></td>
       			<td bgcolor="#F4F4F4"><span class="texto">M&oacute;vil parado</span></td>
    		</tr>
    		<tr>
       			<td bgcolor="#F4F4F4"><img src="imagenes/ref/estrellaSeg.gif" style="vertical-align:bottom"></td>
       			<td bgcolor="#F4F4F4"><span class="texto">En seguimiento</span></td>
    		</tr>
    		<tr>
       			<td bgcolor="#F4F4F4"><img src="imagenes/ref/estrellaSel.gif" style="vertical-align:bottom"></td>
       			<td bgcolor="#F4F4F4"><span class="texto">Seleccionado</span></td>
    		</tr>
    		<tr>
       			<td bgcolor="#F4F4F4"><img src="imagenes/ref/inicio.gif" style="vertical-align:bottom"></td>
       			<td bgcolor="#F4F4F4"><span class="texto">Inicio de recorrido hist&oacute;rico</span></td>
    		</tr>
    		<tr>
       			<td bgcolor="#F4F4F4"><img src="imagenes/ref/fin.gif" style="vertical-align:bottom"></td>
       			<td bgcolor="#F4F4F4"><span class="texto">Fin de recorrido hist&oacute;rico</span></td>
    		</tr>
    		<tr>
       			<td bgcolor="#F4F4F4"><img src="imagenes/ref/evento.gif" style="vertical-align:bottom"></td>
       			<td bgcolor="#F4F4F4"><span class="texto">Evento</span></td>
    		</tr>
    		<tr>
       			<td bgcolor="#F4F4F4"><img src="imagenes/ref/exceso.gif" style="vertical-align:bottom"></td>
       			<td bgcolor="#F4F4F4"><span class="texto">Exceso de velocidad</span></td>
    		</tr>
    		<tr>
       			<td bgcolor="#F4F4F4"><img src="imagenes/ref/selection.gif" style="vertical-align:bottom"></td>
       			<td bgcolor="#F4F4F4"><span class="texto">Posici&oacute;n seleccionada</span></td>
    		</tr>
    		<tr>
       			<td bgcolor="#F4F4F4"><img src="imagenes/ref/datoInvalido.gif" style="vertical-align:bottom"></td>
       			<td bgcolor="#F4F4F4"><span class="texto">Dato inv&aacute;lido</span></td>
    		</tr>
    		<tr>
       			<td bgcolor="#F4F4F4"><img src="imagenes/ref/sentido.gif" style="vertical-align:bottom"></td>
       			<td bgcolor="#F4F4F4"><span class="texto">Sentido del m&oacute;vil</span></td>
       			
    		</tr>
    		<tr>
    			<td colspan="2">
       				<table class="texto" border="1">
       					<tr><td colspan="2" align="center">Tabla de sentidos</td></tr>
       					<tr><td align="center"><b>n</b></td><td>Norte</td></tr>
       					<tr><td align="center"><b>ne</b></td><td>Noreste</td></tr>
       					<tr><td align="center"><b>e</b></td><td>Este</td></tr>
       					<tr><td align="center"><b>se</b></td><td>Sureste</td></tr>
       					<tr><td align="center"><b>s</b></td><td>Sur</td></tr>
       					<tr><td align="center"><b>so</b></td><td>Suroeste</td></tr>
       					<tr><td align="center"><b>o</b></td><td>Oeste</td></tr>
       					<tr><td align="center"><b>no</b></td><td>Noroeste</td></tr>
       					
       				</table>
       			</td>
    		</tr>
    		</table>
    		</div>
        </div>
      </div>  
  </div>
  </td>
  </tr>
  </table>
  
</td>
</tr>
</table>
<script>

   //FECHA DESDE!
   var dateIni;
   dateIni = "";
   if  (document.frmHistoricoAvl.diai.value != "") {
   		dateIni = document.frmHistoricoAvl.diai.value;
		dateIni += "/" + document.frmHistoricoAvl.mesi.value;
		dateIni += "/" + document.frmHistoricoAvl.anoi.value;
		dateIni += " " + document.frmHistoricoAvl.horaInicio.value;
  	 }
   else{   
   		var actualDate = new Date();
		var time = actualDate.getTime();
		time -= Date.HOUR;
		actualDate = new Date(time);
		dateIni = actualDate.print("%d") + '/' + actualDate.print("%m") + '/' + actualDate.print("%Y") + ' ' + actualDate.print("%H:%M"); 
		document.frmHistoricoAvl.diai.value = actualDate.print("%d");
		document.frmHistoricoAvl.mesi.value = actualDate.print("%m");
		document.frmHistoricoAvl.anoi.value = actualDate.print("%Y");
		document.frmHistoricoAvl.horaInicio.value = actualDate.print("%H:%M");  
   } 
   
   document.frmHistoricoAvl.fechaInicio.value = dateIni;

   function fechaIniChange(cal){
	    var date = cal.date;
		document.frmHistoricoAvl.diai.value = date.print("%d");
		document.frmHistoricoAvl.mesi.value = date.print("%m");
		document.frmHistoricoAvl.anoi.value = date.print("%Y");
		document.frmHistoricoAvl.horaInicio.value = date.print("%H:%M");
	}

	Calendar.setup(	
		{
		inputField 	   : "fechaInicio",  
		ifFormat       : "%d/%m/%Y %H:%M",      
        showsTime      : true,
        timeFormat     : "24",
		button		   : "fechaInicioBtn",
		onUpdate       : fechaIniChange
		} 
	);	
	
	//FECHA HASTA!
   var dateFin;
   dateFin = "";
   if  (document.frmHistoricoAvl.diaf.value != "") {
   		dateFin = document.frmHistoricoAvl.diaf.value;
		dateFin += "/" + document.frmHistoricoAvl.mesf.value;
		dateFin += "/" + document.frmHistoricoAvl.anof.value;
		dateFin += " " + document.frmHistoricoAvl.horaFin.value;
  	 }
   else{   
   		actualDate = new Date();
		time = actualDate.getTime();
		time += Date.HOUR;
		actualDate = new Date(time);
		dateFin = actualDate.print("%d") + '/' + actualDate.print("%m") + '/' + actualDate.print("%Y") + ' ' + actualDate.print("%H:%M");  
		document.frmHistoricoAvl.diaf.value = actualDate.print("%d");
		document.frmHistoricoAvl.mesf.value = actualDate.print("%m");
		document.frmHistoricoAvl.anof.value = actualDate.print("%Y");
		document.frmHistoricoAvl.horaFin.value = actualDate.print("%H:%M"); 
   } 
   
   document.frmHistoricoAvl.fechaFin.value = dateFin;

   function fechaFinChange(cal){
	    var date = cal.date;
		document.frmHistoricoAvl.diaf.value = date.print("%d");
		document.frmHistoricoAvl.mesf.value = date.print("%m");
		document.frmHistoricoAvl.anof.value = date.print("%Y");
		document.frmHistoricoAvl.horaFin.value = date.print("%H:%M");
	}

	Calendar.setup(	
		{
		inputField 	   : "fechaFin",  
		ifFormat       : "%d/%m/%Y %H:%M",      
        showsTime      : true,
        timeFormat     : "24",
		button		   : "fechaFinBtn",
		onUpdate       : fechaFinChange
		} 
	);

	function initialize() {
	  document.getElementById("busyImg").style.visibility = "hidden";
	  AccordionMenu = new Spry.Widget.Accordion("AccordionMenu");
	  document.getElementById("colorId").value = "#" + '<?=COLOR_DEFAULT_RECORRIDO_GMAP?>';
	  document.getElementById("colorText").style.backgroundColor = document.getElementById("colorId").value;
	  hideDiv('div_resultadoHistorico');
      if (GBrowserIsCompatible()) {
      	map = new GMap2(document.getElementById("map_canvas"), {mapTypes:[<?=GMAP_TYPES_MAPS?>]}); 
        map.addControl(new GLargeMapControl());
        map.addControl(new GMapTypeControl());
        map.addControl(new GOverviewMapControl()); 
        map.setCenter(new GLatLng(<?=$yCenter?>,<?=$xCenter?>), <?=GMAP_INITIAL_ZOOM?>);
        setInterval("AutoRefreshForm();", eval(<?= GMAP_MAPA_REFRESH_AVL ?>) * 1000);
        RefreshForm();
      }
    }
</script>
<form>
</body>
</html>
